<template>
  <div style="background-color: rgba(169,169,169,0.39)">
    <br>
    <div style="display: flex;align-items: center;flex-direction: column">
      <div style="background-color: white;margin-bottom:10px;border-radius: 2px;width: 90% " v-for="data in data" class="row">

           <span style="margin-right: 60px"> id:{{ data.id }}</span>


           <span style="margin-right: 60px">发言人：{{ data.data.from }}</span>
           <span :style="{color:data.data.color1}" style="margin-right: 60px"> 内容：{{ data.data.content }}</span>
         <el-button  @click="del(data.id)" type="danger">删除 </el-button>
         </div>


    </div>

  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "admin",
  data() {
    return {
      data: []
    }
  },
  methods:{
    del(id){
      axios.get("http://localhost:9090/data/del?id="+id).then(res=>{
         if (res.data=="ok"){
           axios.get("http://localhost:9090/data/get").then(res => {
             let data = res.data
             let  d=[]
             for (let i = 0; i < data.length; i++) {
               d.push({
                 id: data[i].id,
                 data: JSON.parse(data[i].data)
               })
             }
             this.data=d

           })
         }
      })
    }
  },
  mounted() {
    if (localStorage.getItem("name") != "admin") {
      this.$router.push({
        name: 'login'
      })
    } else {
      axios.get("http://localhost:9090/data/get").then(res => {
        let data = res.data
        for (let i = 0; i < data.length; i++) {
          this.data.push({
            id: data[i].id,
            data: JSON.parse(data[i].data)
          })
        }


      })
    }
  }
}
</script>

<style scoped>
.row {
  display: flex;
  flex-direction: row;
  align-items: center;

}


</style>